<style scoped>

.extendGroup {
  float: right;
  margin-right: 20px;
  opacity: 0;
}

.el-tree-node__content:hover .extendGroup {
  opacity: 1;
}
.span_btn_pad{padding-left:3px;}
</style>

<template>
  <div>

      <template v-if="routerPath=='accountassets'" >
        <div v-loading="loading">
          <!--工具条-->
          <el-col :span="24" class="toolbar toolbar_header" style="padding-bottom: 0px;">
            <el-form :inline="true" :model="filters">               
              <el-form-item label="币种:">
                <el-select v-model="filters.coinId" placeholder="请选择">
                  <el-option label="全部" value=""></el-option>
                  <el-option v-for="item in currList" :label="item.name" :value="item.coinId" :key="item.coinId"></el-option>
                </el-select>
              </el-form-item>                  
              <el-form-item label="手机号:">
                <el-input v-model="filters.mobile" placeholder="可模糊匹配"></el-input>
              </el-form-item>   
              <el-form-item label="钱包地址:">
                <el-input v-model="filters.address" placeholder=""></el-input>
              </el-form-item>           
              <el-form-item label="排序:" class="sort">
                <el-select v-model="filters.orderColumn" placeholder="请选择">
                  <el-option label="全部" value="0"></el-option>
                  <el-option label="账户余额" value="1"></el-option>                  
                  <el-option label="冻结金额" value="2"></el-option>                  
                </el-select>
                <el-select v-model="filters.orderType" placeholder="请选择">
                  <el-option label="无" value="0"></el-option>
                  <el-option label="升序" value="1"></el-option>                  
                  <el-option label="降序" value="2"></el-option>                  
                </el-select>
              </el-form-item>  
              <el-form-item label="状态:">
                <el-select v-model="filters.statue" placeholder="请选择">
                  <el-option label="全部" value="0"></el-option>
                  <el-option label="正常" value="1"></el-option>                  
                  <el-option label="冻结" value="2"></el-option>                  
                </el-select>
              </el-form-item>  
              <el-form-item>
                <el-button type="primary" v-on:click="fetchData">搜索</el-button>
              </el-form-item>
            </el-form>
          </el-col>        
        <!-- table start  -->
        <el-table :data="list" style="width: 100%" max-height="1000">
          <el-table-column width="37">
            <template scope="scope">
              <img src="../assets/img/sysFile.gif">
            </template>
          </el-table-column> 
          <el-table-column label="账户ID" prop="coinWalletId" >
          </el-table-column>
          <el-table-column prop="userName" label="用户名" width="100" >
          </el-table-column>
              
          <el-table-column prop="realName" label="真实姓名" >
          </el-table-column>
          <el-table-column prop="currName" label="手机号" >
          </el-table-column>
          <el-table-column prop="coinTitle" label="币种名称" >
          </el-table-column>       
          <el-table-column prop="balance" label="账户余额">
          </el-table-column>
          <el-table-column prop="freeze" label="冻结金额" >
          </el-table-column>
          <el-table-column prop="address" label="钱包地址" width="200">
          </el-table-column>
          
          <el-table-column prop="status" label="状态" :formatter="formatSex">
          </el-table-column>
          <el-table-column label="操作" width="107">
            <template slot-scope="scope">       
             <!--  <span class="span_btn " @click="handleRecharge(scope.$index, scope.row)" >充值</span>
              <span class="span_btn span_btn_pad" @click="handleWithdraw(scope.$index, scope.row)" >提现</span>
              <span class="span_btn span_btn_pad" @click="handleFrozenReward(scope.$index, scope.row)" >奖励冻结</span> -->
              <span class="span_btn span_btn_pad" @click="handleThaw(scope.$index, scope.row)" >奖励解冻</span>
              <span class="span_btn span_btn_pad" @click="handleFrozen(scope.$index, scope.row)" >冻结</span>
             
            </template>
          </el-table-column>
        </el-table>
          <!--工具条-->
        <el-col :span="24" class="toolbar toolbar_footer">
          <el-pagination v-if="total" background layout="prev, pager, next,total,jumper" @current-change="handleCurrentChange" :page-size="showCount" :total="total" style="float:right;">
          </el-pagination>
        </el-col>
        <!-- table end  -->

      </div>
      </template>
       <template v-else>
        <router-view></router-view>
      </template>
  </div>

  
  
</template>

<script>
import * as coinwallet from '../api/coinwallet';
import * as currency from '../api/currency';

let myMixin = {
  data: function() {
    return { coinwallet }
  }
}

export default {
  mixins: [myMixin],
  data() {
    return {
      currList:[],
      filters:{},
      isDel:true,
      isEdit:true,
      isReleRole:true,
      isReleGroup:true,
      total: 10,
      page: 1,
      showCount:10,
      routerPath:'',
      addLoading:false,//
      editLoading:false,//
      list: [
        { userName:"test",
          userGender:1,
          loginName:"test",
          loginPass:"test",
          phoneNum:"test",
          userMail:"test",
          certNo:"test",
        },
        { userName:"test",
          userGender:2,
          loginName:"test",
          loginPass:"test",
          phoneNum:"test",
          userMail:"test",
          certNo:"test",
        }
      ],
      canReset: true,
      loading: false,
      groupId:'',//组id
      userId:''//用户id
    }
  },
  methods: {
    handleFrozenReward:function(){
      //奖励冻结
    },
    handleRecharge:function(){
       /* let para={
        posNo:row.posNo,
        posStat:row.posStat.toString()//1:正常，2：停用
      }
      matterManage.updateDeviceStat(para,(res)=>{
        if(res.retCode==1){
          // this.$message("修改状态成功");
            this.fetchData();
        }else{
          this.$message({
            message: res.retMsg,
            type: 'error'
          });
        }
      })*/
    },
    handleWithdraw:function(){
       /* let para={
        posNo:row.posNo,
        posStat:row.posStat.toString()//1:正常，2：停用
      }
      matterManage.updateDeviceStat(para,(res)=>{
        if(res.retCode==1){
          // this.$message("修改状态成功");
            this.fetchData();
        }else{
          this.$message({
            message: res.retMsg,
            type: 'error'
          });
        }
      })*/
    },
    handleThaw:function(){
       /* let para={
        posNo:row.posNo,
        posStat:row.posStat.toString()//1:正常，2：停用
      }
      matterManage.updateDeviceStat(para,(res)=>{
        if(res.retCode==1){
          // this.$message("修改状态成功");
            this.fetchData();
        }else{
          this.$message({
            message: res.retMsg,
            type: 'error'
          });
        }
      })*/
    },
    handleFrozen:function(){
       /* let para={
        posNo:row.posNo,
        posStat:row.posStat.toString()//1:正常，2：停用
      }
      matterManage.updateDeviceStat(para,(res)=>{
        if(res.retCode==1){
          // this.$message("修改状态成功");
            this.fetchData();
        }else{
          this.$message({
            message: res.retMsg,
            type: 'error'
          });
        }
      })*/
    },

     //状态转换
    formatSex: function (row, column) {
      return row.status == 1 ? '正常' : '冻结';
    },
    handleCurrentChange(val) {
      this.page = val;
      // this.getcoinwallet();
      this.fetchData();
    },
    fetchDataCurr() {
      //获取币种列表
 
     let para = {
          showCount:this.showCount,
          currentPage:this.page,//当前查询页
          // name:this.filters.name
        };

      currency.request.r(para).then((res) => {
        console.log(res);
        if(res.data.retCode==1){
          this.currList=res.data.data.list
        }else{
          this.$message.error(res.data.retMsg)
        }
    
      });
    },
    fetchData(init) {
      this.loading = true;
     /* if(!this.$_has([coinwallet.request])){
        this.$message("暂无权限");
        this.loading = false;

        return;
      }*/
        let para = {
          // userId:this.userId,
          mobile:this.filters.mobile,
          address:this.filters.address,
          status:this.filters.status,
          orderColumn:this.filters.orderColumn,
          orderType:this.filters.orderType,
          showCount:this.showCount,
          currentPage:this.page,
          keyword:this.filters.name
        };
        console.log(para)
      coinwallet.request.r(para).then((res) => {
        console.log(res);
        if(res.data.retCode==1){
          if(res.data.data.totalRow>0){
            this.total=parseInt(res.data.data.totalRow);
            this.list = res.data.data.list;
            this.list.map(x=>{
              x.value=x.coinTitle;
              x.withForm={amount:'',userWalletId:'',mobileCode:'',payPassword:''};
              x.withdrawList=[];
            })
       
          }
         
        
        }else{
          this.$message.error(res.data.retMsg)
        }
     
        this.loading = false;
      });
    },
    requestNotAllowed: function(){
      coinwallet.notAllowed.r();
    }
  },
  watch: {
          // 如果路由有变化，会再次执行该方法
          "$route": function(){
            this.routerPath=this.$route.path.split("/").pop();
            // this.groupId="";
            this.fetchData(true)

          }
  },
  created() {
   /* this.isReleRole=this.$_has([coinwallet.releRolesUser]);
    this.isReleGroup=this.$_has([coinwallet.releGroupUser]);
    this.isEdit=this.$_has([coinwallet.modify]);
    this.isDel=this.$_has([coinwallet.remove]);
    if(this.$route.query.groupId!=undefined&&this.$route.query.groupId!="undefined"&&this.$route.query.groupId!=""){
      this.groupId=this.$route.query.groupId;
    }*/
    this.fetchDataCurr();
    this.fetchData(true)
    /*console.log(this.$route.path.split("/").pop())*/
    this.routerPath=this.$route.path.split("/").pop();
    

  }
}
</script>